var ProgressLine = (function(window) {
	var ProgressLine = function(canvasId, progress) {
		return new ProgressLine.fn.init(canvasId, progress)
	}

	ProgressLine.fn = ProgressLine.prototype = {
		constructor : ProgressLine,
		init : function(canvasId, progress) {
			this.canvasId = canvasId
			this.canvas = document.getElementById(canvasId)
			this.context = this.canvas.getContext('2d')
			this.progress = progress
			this.create = function() {
				this.createProgressLine()
			}
		},
		createProgressLine : function() {
			this.drawProgress(this.progress)
		},
		drawProgress : function() {
			this.context.clearRect(0, 0, this.canvas.width, this.canvas.height)
			// 首先绘制背景
			this.drawBg()
			// 开始绘制绿色线段
			this.context.beginPath()
			this.context.lineWidth = 50// 设置线宽
			this.context.strokeStyle = 'green'// 画笔颜色
			this.context.lineTo(0, 0)
			this.context.lineTo(this.progress, 0)
			this.context.stroke()
			this.context.closePath()
		},
		drawBg : function() {
			this.context.beginPath()
			this.context.lineWidth = 50
			this.context.strokeStyle = '#fff'
			this.context.lineTo(0, 0)
			this.context.lineTo(this.canvas.width, 0)
			this.context.stroke()
			this.context.closePath()
		}
	}

	ProgressLine.fn.init.prototype = ProgressLine.fn
	return ProgressLine
})()
